<!--
 * @Description:配套弹窗
 * @Autor: 商晓彬
 * @Date: 2021-06-23 12:09:31
 * @LastEditors: 商晓彬
 * @LastEditTime: 2021-12-20 12:02:49
-->
<div bsModal #createOrEditModal="bs-modal" (onShown)="onShown()" class="modal fade sum" tabindex="-1" role="dialog"
    aria-labelledby="createOrEditModal" aria-hidden="true" [config]="{backdrop: 'static', keyboard: !saving}">
    <div style="width:1880px!important;margin: 1.75rem auto;">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">
                    <span>配套出库</span>
                </h4>
                <button type="button" class="close" (click)="close()" [attr.aria-label]="l('Close')">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="m-content">
                    <div class="row">
                        <div class="col-lg-4">
                            <span class="title">配套任务信息</span>
                            <div class="m-content">
                                <div class="m-portlet m-portlet--mobile">
                                    <div class="m-portlet__body">
                                        <div class="row align-items-center">
                                            <div class="primeng-datatable-container">
                                                <div class="col-md-12" style="
                                                                float: left;
                                                                height: 625px;">
                                                    <p-tree [value]="files2" selectionMode="single"
                                                        [(selection)]="selectedFiles"
                                                        (onNodeSelect)="nodeSelect($event)" [style]="{ height: '90%' }"
                                                        [loading]="loadingtree">
                                                        <ng-template let-node pTemplate="default">
                                                            <img class="imgcontent"
                                                                src="../../../assets/common/images/三级图标.png"
                                                                *ngIf="node.nodeLevel==8||node.nodeLevel==9" width="20"
                                                                height="20" />
                                                            <img class="imgcontent"
                                                                src="../../../assets/common/images/0.png"
                                                                *ngIf="node.nodeLevel=='undefind'" width="20"
                                                                height="20" />
                                                            <img class="imgcontent"
                                                                src="../../../assets/common/images/1.png"
                                                                *ngIf="node.nodeLevel==1" width="20" height="20" />
                                                            <img class="imgcontent"
                                                                src="../../../assets/common/images/2.png"
                                                                *ngIf="node.nodeLevel==2" width="20" height="20" />
                                                            <img class="imgcontent"
                                                                src="../../../assets/common/images/3.png"
                                                                *ngIf="node.nodeLevel==3" width="20" height="20" />
                                                            <img class="imgcontent"
                                                                src="../../../assets/common/images/4.png"
                                                                *ngIf="node.nodeLevel==4" width="20" height="20" />
                                                            <img class="imgcontent"
                                                                src="../../../assets/common/images/5.png"
                                                                *ngIf="node.nodeLevel==5" width="20" height="20" />
                                                            <span
                                                                *ngIf="node.key==-1">{{node.model}}-{{node.lotNo}}-{{node.nodeDrawingNo}}-{{node.nodeName}}-{{node.stageSign}}</span>
                                                            <span
                                                                *ngIf="node.key!=-1">{{node.nodeDrawingNo}}-{{node.nodeName}}</span>
                                                            <span class="ptagisRelation"
                                                                *ngIf="node.isRelation==1&&node.isExport!=1">{{node.isRelation==1?'已关联':''}}</span>
                                                            <span class="ptagisExport"
                                                                *ngIf="node.isExport==1">{{node.isExport==1?'已导出':''}}</span>
                                                        </ng-template>
                                                    </p-tree>

                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-8">
                            <div style="margin-top: 25px;">
                                <!-- 右侧 -->
                                <p-treeTable [value]="tableData" [scrollable]="true" scrollHeight="660px"
                                    [scrollable]="true">
                                    <ng-template pTemplate="header" let-rowData="rowData">
                                        <tr>
                                            <th style="width: 80px">
                                                层级
                                            </th>
                                            <th style="width: 110px">物料图号</th>
                                            <th style="width: 110px">物料名称</th>
                                            <th style="width: 110px">规格</th>
                                            <th style="width: 110px">物料层级</th>
                                            <th style="width: 110px">物料类别</th>
                                            <th style="width: 110px">年代号</th>
                                            <th style="width: 110px">单位</th>
                                            <th style="width: 110px">工艺用量</th>
                                            <th style="width: 130px">芯级预配套数量</th>
                                            <th style="width: 130px">可用预配套数量</th>
                                            <th style="width: 110px">配套数量</th>
                                            <th style="width: 110px">缺料数量</th>
                                            <th style="width: 110px">出库数量</th>
                                            <th style="width: 110px">配套状态</th>
                                            <th style="width: 110px">配套人</th>
                                            <th style="width: 110px">配套时间</th>
                                            <th style="width: 110px">预配套人</th>
                                            <th style="width: 110px">预配套时间</th>

                                        </tr>
                                    </ng-template>
                                    <ng-template pTemplate="body" let-rowNode let-rowData="rowData">
                                        <tr [ttRow]="rowNode">
                                            <td style="width: 80px">
                                                <p-treeTableToggler [rowNode]="rowNode"></p-treeTableToggler>
                                                {{rowData.levelName}}
                                            </td>
                                            <td style="width: 110px">{{rowData.code}}</td>
                                            <td style="width: 110px">{{rowData.name}}</td>
                                            <td style="width: 110px">{{rowData.module}}</td>
                                            <td style="width: 110px">{{rowData.joinText}}</td>
                                            <td style="width: 110px">{{rowData.materialsNodeName}}</td>
                                            <td style="width: 110px">{{rowData.yearsNo}}</td>
                                            <td style="width: 110px">{{rowData.unit}}</td>
                                            <td style="width: 110px">{{rowData.number}}</td>
                                            <td style="width: 130px">{{rowData.preSuiteStock}}</td>
                                            <td style="width: 130px">{{rowData.usableMatingQuantityStock}}</td>
                                            <td style="width: 110px">{{rowData.suiteStock}}</td>
                                            <td style="width: 110px">{{rowData.starvingStock}}</td>
                                            <td style="width: 110px">{{rowData.deliveryStock}}</td>
                                            <td style="width: 110px">{{rowData.matingStatusName}}</td>
                                            <td style="width: 110px">{{rowData.completePeople}}</td>
                                            <td style="width: 110px">{{rowData.completeTime|date:'yyyy-MM-dd'}}</td>
                                            <td style="width: 110px">{{rowData.preSuiteName}}</td>
                                            <td style="width: 110px">{{rowData.preSuiteTime|date:'yyyy-MM-dd'}}</td>

                                        </tr>
                                    </ng-template>
                                </p-treeTable>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>